<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>

		<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" />
		<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" />
		<link rel="stylesheet" type="text/css" href="easyui/demo/demo.css" />
		<script src="easyui/jquery.min.js" type="text/javascript" charset="utf-8"></script>

		<script src="easyui/jquery.easyui.min.js" type="text/javascript" charset="utf-8"></script>

		<!--<script src="js/easyui-lang-zh_CN.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="js/jquery.serializejson.min.js"></script>
	-->
	</head>

	<body>
		<div class="easyui-layout" data-options="fit:true,border:false">
			
			<!-- <div data-options="region:'south',split:true" style="height:50px;"></div> -->

			<div data-options="region:'west',split:true" title="导航菜单" style="width:200px;">

				<div class="easyui-accordion" data-options="fit:true,border:false">

					
				

				</div>
			</div>
			<div data-options="region:'center',title:'Main Title',iconCls:'icon-ok'">

				<div id="wu-tabs" class="easyui-tabs" data-options="fit:true,border:false">


						<table id="dg"></table>

		<div id="dlg" class="easyui-dialog" title="Basic Dialog" data-options="iconCls:'icon-save',closed:true" style="width:400px;height:260px;padding:10px">

			<form id="ff" method="post">
				<div style="margin-bottom:20px">
					<input class="easyui-textbox" name="title" style="width:100%" data-options="label:'title:',required:true">
				</div>
				<div style="margin-bottom:20px">
					<input class="easyui-textbox" name="author" style="width:100%" data-options="label:'author:',required:true">
				</div>
				<div style="margin-bottom:20px">
					<input class="easyui-textbox" name="subheading" style="width:100%" data-options="label:'subheading:',required:true">
				</div>
				<div style="margin-bottom:20px">

					<input class="easyui-textbox" name="content" style="width:100%;margin-bottom:20px" data-options="label:'content:',required:true">
				</div>
				<div style="margin-bottom:20px">

					<input class="easyui-textbox" name="_id" style="width:100%;margin-bottom:20px" data-options="label:'_I&nbsp;&nbsp;d&nbsp;:'">
				</div>

			</form>
			<div style="text-align:center;padding:5px 0">
				<a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()" style="width:80px">提交</a>
				<a href="javascript:void(0)" class="easyui-linkbutton" onclick="clearForm()" style="width:80px">清除</a>
				<a href="javascript:void(0)" class="easyui-linkbutton" onclick="removetForm()" style="width:80px">删除</a>
			</div>
		</div>
	
		<div style="margin:20px 0;">
			<a href="#" class="easyui-linkbutton" onclick="show()">Show</a>
			<a href="#" class="easyui-linkbutton" onclick="slide()">Slide</a>

		</div>

		<style type="text/css">
			.opt {
				text-decoration: none;
				color: #333;
				display: inline-block;
				padding-left: 19px;
				width: 32px;
				line-height: 25px;
				background: url('../easyui/themes/icons/pencil.png') no-repeat left;
			}
			
			#tan {
				width: 100px;
				height: 62px;
				border: 1px solid yellow;
				position: fixed;
				left: 50%;
				margin-left: -50px;
				top: 50%;
				margin-top: -31px;
				text-align: center;
				padding-top: 10px;
			}
			
			#tan button {
				position: absolute;
				bottom: 5px;
			}
		</style>
		<div id="tan" style="display: none;">
			是否删除
			<button style="left: 5px;">确定</button>
			<button style="right: 5px;">取消</button>
		</div>











					
				</div>

			</div>

		</div>
	</body>
	<script type="text/javascript">
		function addTab(title, href, iconCls, iframe) {
			var tabPanel = $('#wu-tabs');
			if(!tabPanel.tabs('exists', title)) {
				var content = '<iframe scrolling="auto" frameborder="0"  src="' + href + '" style="width:100%;height:100%;"></iframe>';
				if(iframe) {
					tabPanel.tabs('add', {
						title: title,
						content: content,
						iconCls: iconCls,
						fit: true,
						cls: 'pd3',
						closable: true
					});
				} else {
					tabPanel.tabs('add', {
						title: title,
						href: href,
						iconCls: iconCls,
						fit: true,
						cls: 'pd3',
						closable: true
					});
				}
			} else {
				tabPanel.tabs('select', title);
			}
		}
		$(function() {
			$('.wu-side-tree a').bind("click", function() {
				var title = $(this).text();
				var url = $(this).attr('data-link');
				var iconCls = $(this).attr('data-icon');
				var iframe = $(this).attr('iframe') == 1 ? true : false;
				addTab(title, url, iconCls, iframe);
			});
		});
	</script>

</html>